// 定义一个带输入框的modal

import React, {PureComponent} from 'react';
import SCModalCore from '../../../components/feedback/scModalCore';
import fetchHandler from '../../../fetch/fetchHandler';
import { getUserList } from '../../../fetch/fetchApi'; //示例api
import PropTypes from 'prop-types';
import WriteForm from '../forms/writeForm';
import {initModals} from "../../../state/action/comAction";

class WriteModal extends PureComponent{
  constructor (props) {
    super();
    this.props = props;
  }

  static contextTypes = {
    store: PropTypes.object.isRequired
  };

  componentWillMount () {
    this.content = (
      <div>
        <WriteForm layout={1} modalSubmit={this.onSubmit.bind(this)}></WriteForm>
      </div>
    );
    this.setState({
      modalConfig: {
        key: 'writeModal',
        width: 600, // 自定义模态框宽度
        title: '回复内容', // 模态窗口的标题
        content: this.content, // 自定义 jsx内容
      }
    });
  }

  /*
  * param {object} 表单中的参数，可以和transfer等其他组件的参数assign来进行提交
  * loadedFuc {func} 来自表单中传递的按钮结束加载状态的事件
  * */

  onSubmit (param) {
    // 在隐藏footer的前提下，采用表单的内置按钮提交事件
    return fetchHandler(getUserList, param).then((res) => {
      // 关闭MODAL
      // TODO(这里执行modal提交callback事件)
      return res;
    });
  }

  myHandler () {
    // 这里需要显示调用对应modal的关闭方法
    this.context.store.dispatch(initModals('demoModal', !1));
  }

  render () {
    return <SCModalCore config={this.state.modalConfig} />
  }
}

export default WriteModal;